/**
 * Class: OpenLayers.BubblePopup
 * 弹出气泡
 *
 * 继承自:
 *  - <OpenLayers.Popup>
 */
/**
 * @requires OpenLayers/Popup.js
 */
OpenLayers.BubblePopup = OpenLayers.Class(OpenLayers.Popup, {
	
	/**
     * APIProperty: width
     * {<string>} 气泡的长度.
     */
	width: null,
	
	/**
     * APIProperty: height
     * {<string>} 气泡的宽度.
     */
	height: null,
	
	balloon: null,
	
	model: "center",
	
	clientOffset:null,
	
	closeBoxCallback: null,
	/**
     * Constructor: OpenLayers.BubblePopup
     * Create a BubblePopup.
     *
     * Parameters:
     * lonlat - {LonLat}	坐标
     * width - {string}		长度
     * height - {string}	宽度
     * contentHTML - {string} 气泡中需要显示的内容
     * closeBoxCallback - {function}	关闭气泡的回调函数	
     * clientOffset	设置气泡窗体中心点的offset 向右向上移动offset.x,offset.y应大于0.	
     */
    initialize: function(lonlat, options){
    	this.settings = jQuery.extend({
    		skin: 'lavender',
    		width: 250,
			height: 150,
			borderColor: "#fff",
			radius: [5,5,5,5],
			spikeratio: 0.55,
			borderopacity: 0.8
    	}, options||{});
    	
    	jQuery.extend(this, this.settings);
    	
    	//this.balloonw = parseFloat(this.width) - 10;
    	//this.balloonh = parseFloat(this.height) - 10;
    	
    	var size = new OpenLayers.Size(this.width, this.height);
    	var closeBox = this.closeBoxCallback ? true : false;
        OpenLayers.Popup.prototype.initialize.apply(this, [null, lonlat, size, this.content, closeBox, this.closeBoxCallback]);
        this.contentDiv.style.overflow = "hidden";
        this.contentDiv.style.padding = "0px";
    },
    
    /**
     * 在气泡中添加内容，或则美化气泡
     */
    doRender: function(px){
    	var self = this;
    	this.balloon = jQuery(this.contentDiv).Balloon(this.settings).data("Balloon");

		this.balloon.closed =function(){
			self.closeBalloon();
		}
    },
    
    draw: function(px) {
        if (px == null) {
            if ((this.lonlat != null) && (this.map != null)) {
                px = this.map.getLayerPxFromLonLat(this.lonlat);
            }
        }
        
        // this assumes that this.map already exists, which is okay because 
        // this.draw is only called once the popup has been added to the map.
        if (this.closeOnMove) {
            this.map.events.register("movestart", this, this.hide);
        }
        
        //listen to movestart, moveend to disable overflow (FF bug)
        if (!this.disableFirefoxOverflowHack && OpenLayers.Util.getBrowserName() == 'firefox') {
            this.map.events.register("movestart", this, function() {
                var style = document.defaultView.getComputedStyle(
                    this.contentDiv, null
                );
                var currentOverflow = style.getPropertyValue("overflow");
                if (currentOverflow != "hidden") {
                    this.contentDiv._oldOverflow = currentOverflow;
                    this.contentDiv.style.overflow = "hidden";
                }
            });
            this.map.events.register("moveend", this, function() {
                var oldOverflow = this.contentDiv._oldOverflow;
                if (oldOverflow) {
                    this.contentDiv.style.overflow = oldOverflow;
                    this.contentDiv._oldOverflow = null;
                }
            });
        }
		
        
        if (!this.autoSize && !this.size) {
            this.setSize(this.contentSize);
        }
        

        //this.setOpacity();
        this.setBorder();
        //this.setContentHTML();
		this.doRender(px);
		this.moveTo(px);
		this.panToCenter();
        if (this.panMapIfOutOfView) {
            this.panIntoView();
        }    
        return this.div;
    },
    
    moveTo: function(px) {
    	var offsetx = this.balloon.getSpikeOffset();
    	px = px.add(-offsetx+this.balloon.borderWidth/2, -this.height+this.balloon.borderWidth/2);
        if(this.clientOffset){
            px = px.add(this.clientOffset.x,this.clientOffset.y);
        }
        if ((px != null) && (this.div != null)) {
            this.div.style.left = px.x + "px";
            this.div.style.top = px.y + "px";
        }
    },
    
    panToCenter: function(){
    	if(this.model.toLowerCase() == "bottom"){
        	this.map.panTo(this.lonlat);
        }
        if(this.model.toLowerCase() == "center"){
        	var resolution = this.map.getResolution();
        	var offsetlat = resolution*parseFloat(this.height)/2;
        	var newlonlat = this.lonlat.clone();
        	newlonlat.lat = newlonlat.lat + offsetlat;
        	this.map.panTo(newlonlat);
        }
    },
    /**
     * 关闭气泡
     */
    closeBalloon: function(){
    	if(!this.balloon.state){
    		this.hide();
    		if(this.closeBoxCallback != null && this.closeBoxCallback != undefined){
    			this.closeBoxCallback();
    		}
    	}
    },
    
    
    CLASS_NAME: "OpenLayers.BubblePopup"
});